<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="height:400px"></div>
    <!-- ECharts单文件引入 -->
<script src='https://cdn.bootcss.com/echarts/3.4.0/echarts.js'></script>
<script src='ecStat.js'></script>
<script>
                // 基于准备好的dom，初始化echarts图表
        var myChart = echarts.init(document.getElementById('main'));
                
                var colors = ['#5793f3', '#d14a61', '#675bba'];
    var data = [     //点数据
    [1, 4862.4],
    [2, 5294.7],
    [3, 5934.5],
    [4, 7171.0],
    [5, 8964.4],
    [6, 10202.2],
    [7, 11962.5],
    [8, 14928.3],
    [9, 16909.2],
    [10, 18547.9],
    [11, 21617.8],
    [12, 26638.1],
    [13, 34634.4],
    [14, 46759.4],
    [15, 58478.1],
    [16, 67884.6],
    [17, 74462.6],
    [18, 79395.7]
];

// See https://github.com/ecomfe/echarts-stat
var myRegression=ecStat.regression('exponential',data);// 回归方程
myRegression.points.sort(function(a,b){
    return a[0]-b[0];
});
option={
   title:{  //主标题，副标题，link，位置
    text:'1981 - 1998 gross domestic product GDP (trillion yuan)',
    subtext:'By ecStat.regression',
    sublink: 'https://github.com/ecomfe/echarts-stat',
    left: 'center'
   },
   tooltip:{  //鼠标移过的提示
    trigger:'axis',
    axisPointer:{
        type:'cross',
    }
   },
   xAxis:{    type:'value',
    splitLine:{        //x轴的分割线
        lineStyle:{type:'dashed'} 
          },
    splitNumber:20         //坐标轴分割段数
   },
   yAxis:{
    type:'value',
    splitLine:{
        lineStyle:{type:'dashed'}
    }
   },
   series:[{
    name:'scatter',
    type:'scatter',
    label:{
        emphasis:{   //悬停时的标签，位置和样式
            show:true,
            position:'left',
            textStyle:{color:'blue',fontSize:16}
        }
    },
    data:data
   },{
    name:'line',
    type:'line',
    showSymbol:false,      //悬停时显示
    smooth:true,
    data:myRegression.points,
    markPoint:{          //标注//大写
        itemStyle:{
            normal:{color:'transparent'}
        },
        label:{
            normal:{
                show:true,
                position:'left',     
                formatter:myRegression.expression,  //标签内容格式器
                textStyle:{
                    color:'#333',
                    fontSize:14
                }
            } 
        },
        data:[{
            coord:myRegression.points[myRegression.points.length-1]
        }]
    }
   }]
};
                // 为echarts对象加载数据 
                myChart.setOption(option); 
    </script>
</body>